import React, { useMemo } from 'react'
import style from './Index.module.less'
import pic from '@img/arbitrator-ico.png'

function Main ({ data, size, onClick }) {
  const url = useMemo(() => {
    if (data && data.ico_file && data.ico_file instanceof Array && data.ico_file.length > 0) {
      return `/${data.ico_file[0].path}`
    }
    return pic
  }, [data])
  return (
    <div className={style.container} style={{ fontSize: `${size}px` }} onClick={() => onClick(data)}>
      <div className={style.institution}>
        {data.institution_name}
      </div>
      <div className={style.body}>
        <div className={style.pic}>
          <img src={url} />
        </div>
        <div>
          <div className={style.name}>姓名：{data.name}</div>
          <div className={style.line}>性别：{data.gender || '无'}</div>
          <div className={style.line}>职业分类：{data.occupation || '无'}</div>
          <div className={style.line}>擅长专业：{data.special || '无'}</div>
          <div className={style.line}>所在区域：{data.area || '无'}</div>
        </div>
      </div>
    </div>
  )
}

export default Main
